<script setup lang="ts">
import SysDialog from '@/components/SysDialog/index.vue';
import useBaseModel from '@/composables/system/user/useBaseModel';
import useUserAddAndEdit from '@/composables/system/user/useUserAddAndEdit';
import useDialog from '@/hooks/useDialog';

// 基础数据
const { addModel, rules } = useBaseModel()

// 弹框
const { dialog, onShow, onClose } = useDialog()

// 注册事件
const emit = defineEmits(['save'])

const { onConfirm, show, addUserForm } = useUserAddAndEdit(dialog, onShow, onClose, addModel, emit)

// 暴露方法给外部使用
defineExpose({
    show
})

</script>
<template>
    <SysDialog :title="dialog.title" :width="dialog.width" :height="150" :visible="dialog.visible" @onClose="onClose"
        @onConfirm="onConfirm">
        <template v-slot:content>
            <el-form :model="addModel" ref="addUserForm" :rules="rules" label-width="80px">
                <el-row>
                    <el-col :span="12" :offset="0">
                        <el-form-item prop="username" label="用户名称">
                            <el-input v-model="addModel.username"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12" :offset="0">
                        <el-form-item prop="password" label="用户密码">
                            <el-input v-model="addModel.password"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="12" :offset="0">
                        <el-form-item prop="nickname" label="用户昵称">
                            <el-input v-model="addModel.nickname"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12" :offset="0">
                        <el-form-item prop="status" label="状态">
                            <el-radio-group v-model="addModel.status">
                                <el-radio label="1">正常</el-radio>
                                <el-radio label="2">停用</el-radio>
                            </el-radio-group>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="12" :offset="0">
                        <el-form-item prop="mobile" label="手机号">
                            <el-input v-model="addModel.mobile"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12" :offset="0">
                        <el-form-item prop="email" label="邮箱">
                            <el-input v-model="addModel.email"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
        </template>
    </SysDialog>
</template>
<style lang="scss" scoped>
</style>